<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>爬虫练习</title>
        <script type="text/javascript" src="./lib/jquery-3.3.1.min.js"></script>
        <script>
            // http://localhost:8082/crawler/getContent?url=http://www.shicimingju.com/chaxun/list/4059.html
            $(function () {
                function getContent(url) {
                    let content = "";
                    $.get(
                        "http://localhost:8082/crawler/getContent?url=" + url,
                        (res) => {
                            $(".content").html(res);
                        }
                    );
                }

                $(".down").click(function () {
                    let url = $(".url").val();
                    console.log(url);
                    let content = "";
                    if (url != "") {
                        getContent(url);
                    }
                });
            });
        </script>
        <style>
            .content {
                width: 500px;
                border: 1px solid #000;
                min-height: 500px;
                padding: 20px;
            }
        </style>
    </head>

    <body>
        <p>http://www.shicimingju.com/chaxun/list/4059.html</p>
        <div>
            地址:<input class="url" />
            <button class="down">获取内容</button>
        </div>
        <div class="content"></div>
    </body>
</html>
